<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./dist/WOW-master/css/libs/animate.css">
    <link rel="stylesheet" href="./dist/css/reset.css">
    <link rel="stylesheet" href="./font/iconfont.css">
    <link rel="stylesheet" href="./css/style.css">
</head>
<body>
    <div class="box">
        <div id="nav">
            <input type="radio" name="navButton" id="navButton">
            <label for="navButton" class="navButton">
                <div class="icon">
                   <span class="wow fadeInUp iconfont icon-menu"></span>
                    <img src="./images/nav装饰.png" alt="">
                </div>
                <div class="navList">
                    <input checked type="radio" name="navItem" id="navItem1">
                    <label for="navItem1">首页<a href="#"></a></label>
                    <input type="radio" name="navItem" id="navItem2">
                    <label for="navItem2">关于我们<a href="#"></a></label>
                    <input type="radio" name="navItem" id="navItem3">
                    <label for="navItem3">风险评估<a href="#"></a></label>
                    <input type="radio" name="navItem" id="navItem4">
                    <label for="navItem4">专业咨询<a href="#"></a></label>
                    <input type="radio" name="navItem" id="navItem5">
                    <label for="navItem5">专业培训<a href="#"></a></label>
                    <input type="radio" name="navItem" id="navItem6">
                    <label for="navItem6">人体工学资源<a href="#"></a></label>
                    <input type="radio" name="navItem" id="navItem7">
                    <label for="navItem7">会员中心<a href="#"></a></label>
                </div>
            </label>
            <div class="logoBox wow fadeInUp ">
                <img src="./images/logo.png" alt="">
            </div>
            <div class="search wow fadeInUp ">
                <img src="./images/nav装饰.png" alt="">
                <span class="iconfont icon-search"></span>
            </div>
        </div>
        <div id="banner">
            <div class="itemList">
                <div class="item wow fadeInUp ">
                    <img src="./images/banner.png" alt="">
                </div>
            </div>
        </div>
        <div id="estimate">
            <p class="wow fadeInUp ">
                <span>风险评估</span>
            </p>
            <ul>
                <li><a href="#">
                    <div class="imgBox wow fadeInUp ">
                        <img src="./images/办公室.png" alt="">
                    </div>
                    <span>办公室</span>
                </a></li>
                <li><a href="#">
                    <div class="imgBox wow fadeInUp ">
                        <img src="./images/工业.png" alt="">
                    </div>
                    <span>工业</span>
                </a></li>
                <li><a href="#">
                    <div class="imgBox wow fadeInUp ">
                        <img src="./images/self.png" alt="">
                    </div>
                    <span>个人/家居</span>
                </a></li>
                <li><a href="#">
                    <div class="imgBox wow fadeInUp ">
                        <img src="./images/other.png" alt="">
                    </div>
                    <span>其他行业</span>
                </a></li>
            </ul>
        </div>
        <div id="speciality">
            <div class="itemList">
                <div class="imgBox wow fadeInUp ">
                    <img src="./images/advice.png" alt="">
                </div>
                <div class="textBox wow fadeInUp ">
                    <p>专业咨询</p>
                    <p>个人咨询</p>
                    <p>企业咨询</p>
                </div>
                <div class="imgBox wow fadeInUp ">
                    <img src="./images/train.png" alt="">
                </div>
                <div class="textBox wow fadeInUp ">
                    <p>专业咨询</p>
                    <p>培训通知</p>
                    <p>在线培训</p>
                    <p>现场培训</p>
                </div>
                <div class="imgBox wow fadeInUp ">
                    <img src="./images/body.png" alt="">
                </div>
                <div class="textBox wow fadeInUp ">
                    <p>人体工学资源</p>
                    <p>案例分析</p>
                    <p>企业广告</p>
                    <p>产品推荐</p>
                </div>
            </div>
        </div>
        <div id="introduce">
            <p>
                <span>人体工学介绍和应用</span>
            </p>
            <div class="content wow fadeInUp ">
                <div class="imgBox wow fadeInUp ">
                    <img src="./images/introduce.png" alt="">
                </div>
                <div class="history">
                    <div>
                        <p class="wow fadeInUp ">人体工学介绍</p>
                        <div class="itemList">
                            <div class="row">
                                <div class="item wow fadeInUp ">历史</div>
                                <div class="item wow fadeInUp ">现在</div>
                            </div>
                            <div class="row">
                                <div class="item wow fadeInUp ">将来</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="otherList">
                <div class="item">
                    <div class="career">
                        <div class="wow fadeInUp ">
                            <img src="./images/career.png" alt="">
                            <p>职业应用</p>
                        </div> 
                    </div>
                    <div class="self">
                        <div class="wow fadeInUp ">
                            <img src="./images/selef.png" alt="">
                            <p>个人/家居应用</p>
                        </div>
                    </div>
                </div>
                <div class="item">
                    <div class="otherApp">
                        <div class="wow fadeInUp ">
                            <img src="./images/infinite.png" alt="">
                            <p>其他应用</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="concate">
            <p class="wow fadeInUp ">
                <span>联系我们</span>
            </p>
            <div class="container">
                <div class="itemBox">
                    <div class="itemList">
                        <div class="item">
                            <div class="iconBox">
                                <span class="wow fadeInUp  iconfont icon-24gf-telephone"></span>
                            </div>
                            <span class="wow fadeInUp ">+86 15217196291</span>
                        </div>
                    </div>
                    <div class="itemList">
                        <div class="item">
                            <div class="iconBox">
                                <span class="wow fadeInUp  iconfont icon-fax-full"></span>
                            </div>
                            <span class="wow fadeInUp ">01-706-560-3640</span>
                        </div>
                        <div class="item">
                            <div class="iconBox">
                                <span class="wow fadeInUp  iconfont icon-youxiang"></span>
                            </div>
                            <span class="wow fadeInUp ">ergo168@qq.com</span>
                        </div>
                    </div>
                    <div class="itemList">
                        <div class="item">
                            <div class="iconBox">
                                <span class="wow fadeInUp  iconfont icon-weizhi"></span>
                            </div>
                            <span class="wow fadeInUp">广州市天河区珠江新城珠江西路高德置地D座15楼</span>
                        </div>
                    </div>
                </div>
                <div id="map" class="wow fadeInUp"></div>
            </div>
        </div>
        <div id="tabBar">
            <input checked type="radio" name="tabBar" id="tabBar1">
            <input type="radio" name="tabBar" id="tabBar2">
            <input type="radio" name="tabBar" id="tabBar3">
            <input type="radio" name="tabBar" id="tabBar4">
            <div class="labelList">
                <label for="tabBar1">
                    <div class="wow fadeInUp">
                        <span class="iconfont icon-home"></span>
                        <span>首页</span>
                    </div>
                </label>
                <label for="tabBar2">
                    <div class="wow fadeInUp">
                        <span class="iconfont icon-a-guanyuruantong1x                        "></span>
                        <span>关于我们</span>
                    </div>
                </label>
                <label for="tabBar3">
                    <div class="wow fadeInUp">
                        <span class="iconfont icon-pinggu"></span>
                        <span>风险评估</span>
                    </div>
                </label>
                <label for="tabBar4">
                    <div class="wow fadeInUp">
                        <span class="iconfont icon-yonghuguanli"></span>
                        <span>用户中心</span>
                    </div>
                </label>
            </div>
        </div>
    </div>
    <script src="./dist/WOW-master/dist/wow.min.js"></script>
    <script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&type=webgl&ak=PooCHL8Od6x8Insnf9BAdDd8cpoUn66u"></script>
    <script>
        new WOW().init();
        var map = new BMapGL.Map("map");          // 创建地图实例 
        var point = new BMapGL.Point(113.32888 , 23.12609);  // 创建点坐标 
        var marker = new BMapGL.Marker(point);        // 创建标注   
        map.addOverlay(marker);                     // 将标注添加到地图中
        map.centerAndZoom(point, 17);                 // 初始化地图，设置中心点坐标和地图级别
        map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
    </script>
</body>
</html>